<template>
	<view>
		<zgj-indexed-list :options="list" :show-select="false" @click="bindClick" />
	</view>
</template>

<script>
	import zgjIndexedList from '../../components/zgj-indexed-list/zgj-indexed-list.vue'

	export default {
		components: {
			zgjIndexedList
		},
		data() {
			return {
				list: [],
				origin: {}
			};
		},
		onLoad(e) {
			this.$http.get('/web/ai/brands', {}, (res) => {
				this.origin = res.brands
				var list = []
				var curr = null
				var items = null
				var origin = {}
				res.brands.forEach((b) => {
					if (!curr) {
						curr = {
							"letter": b.first_letter,
							"data": [b.cn_name]
						}
						items = [b]
					} else {
						if (curr.letter === b.first_letter) {
							curr.data.push(b.cn_name)
							items.push(b)
						} else {
							list.push(curr)
							origin[curr.letter] = items
							curr = {
								"letter": b.first_letter,
								"data": [b.cn_name]
							}
							items = [b]
						}
					}
				})
				if (!!curr) { //last one
					list.push(curr)
					origin[curr.letter]=items
				}
				this.list = list
				this.origin = origin
			console.log(this.origin)
			})
		},
		methods: {
			bindClick(e) {
				console.log(e, e.item.name)
				var brands = this.origin[e.item.key].filter(b=>b.cn_name===e.item.name)
				console.log(brands)
				if(!brands || brands.length===0) return
				var brand = brands[0]
				console.log("brand",brand)
				uni.setStorageSync("brand",brand)
				uni.navigateBack()
			}
		}
	}
</script>

<style lang="scss">

</style>